import { View, ITouchEvent } from "@tarojs/components";
import "./index.scss";
import IconFont from "../../../components/iconfont";
import { STATUS } from "../../../configProvider";

export interface CourseCardProps {
  name: string,
  startTime: string,
  endTime: string,
  weekday: string,
  teacher: string,
  onClick?: (event: ITouchEvent) => void,
  status: STATUS,
  startDate: string,
  endDate: string,
  active?: boolean
}
const CourseCard: React.FC<CourseCardProps> = ({ name, teacher, startTime, endTime, weekday, startDate, endDate, onClick, status, active }) => {
  return (<View className="course-card" onClick={onClick}>
    <View className="course-card-title">{name}</View>
    <View className="course-card-teacher">{teacher}</View>
    <View className="course-card-weekday">{weekday}</View>
    <View className="course-card-duration">{startTime}~{endTime}</View>
    <View className="course-card-date">{startDate}~{endDate}</View>
    <View className="course-card-action" >
      {status === STATUS.STUDENT && (active
        ? <View className="course-card-action-tips">点名中</View>
        : <IconFont name='time' size={70} color='#999' />)}
      {status === STATUS.TEACHER && (active
        ? <View className="course-card-action-tips">点名中</View>
        : <IconFont name='time' size={70} color='#999' />)}
      {status === STATUS.ADMIN && (active
        ? <View className="course-card-action-tips">点名中</View>
        : <IconFont name='edit' size={70} color='#999' />)}
      {status === STATUS.INSTRUCTOR && (active
        ? <View className="course-card-action-tips">点名中</View>
        : <></>)}
    </View>
  </View>)
}
export default CourseCard;
